{% extends 'bootbase.html' %}
{% block title %}Dashboard {{group.name}}{% endblock title %}
{% block style %}
{{block.super}}
 <style>
 iframe {
 	padding-top: 16px;
 	padding-left: 16px;
 }
 </style>
{% endblock %}
{% block breadcrumbs %}
<ol class="breadcrumb">
	<li><a href="{% url 'home' %}">Home</a></li>
</ol>
{% endblock breadcrumbs %}
{% block admin_url %}tabgroup/{{group.id}}{% endblock %}
{% block content %}
<script language="JavaScript">
function autoResize(id){
    var newheight;
    var newwidth;

    if(document.getElementById){
        newheight=document.getElementById(id).contentWindow.document .body.scrollHeight;
        newwidth=document.getElementById(id).contentWindow.document .body.scrollWidth;
    }

    document.getElementById(id).height= (newheight) + "px";
    document.getElementById(id).width= (newwidth) + "px";
}
</script>
<div class="container-fluid">
<ul class="nav nav-tabs">
  {% for p in group.pages %}
  {% if forloop.counter == page %}
  <li class="active"><a href="{{request.path}}?page={{forloop.counter}}">{{p.name}}</a></li>
  {% else %}
  <li><a href="{{request.path}}?page={{forloop.counter}}">{{p.name}}</a></li>
  {% endif %}
  {% endfor %}
</ul>
</div>
<div class="row row-fluid">
{% for chart in dashboard.sorted_charts.all %}
<div class=col-md-6><a href = "{% url 'acacia:chart-detail' chart.id %}"><iframe src="{% url 'acacia:chart-detail' chart.id %}" height="340px" width="640px" marginwidth="0" seamless="seamless" frameborder="0"></iframe></a></div>
{% if forloop.counter|divisibleby:2 %}
</div><div class="row row-fluid">
{% endif %}
{% endfor %}
</div>
{% endblock %}
